<!DOCTYPE html>
<style>
#target {
  width: 100px;
  height: 100px;
}
</style>
<div id='target'></div>
<script src="../../resources/testharness.js"></script>
<script src="../../resources/testharnessreport.js"></script>
<script>
var test = async_test("This test passes if it does not crash. Newly referenced resources in the Web Animations api should be resolved in the style building stage");
target.animate([
    {backgroundImage: 'url(../../animations/resources/blue-100.png)', color: 'blue'},
    {backgroundImage: 'url(../../animations/resources/green-100.png)', color: 'green'},
  ], {duration: 1, fill: 'forwards'});
requestAnimationFrame(test.step_func_done(() => {}));
</script>
